<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="./style/common.css" rel="stylesheet" />
<style>
.item
{
	border: 1px solid #f00;
	margin: 2px;
	padding: 10px;
	display:inline-block;
	font-size:14px;

}

.item span
{
	font-size:14px;
	font-weight:700;
	color: #777;
	display:inline-block;
}

.item h1
{
	font-size:14px;
	font-weight:700;
	color: #d99;
	display:inline;
}

#areaXML
{
	display:inline-block;
	width:98%;
	height:300px;
	background-color: #FF9;
	border: 1px solid #333;
}
#areaParse
{
	display:inline-block;
	width:98%;
	height:300px;
	border: 1px solid #333;
	 overflow-y:auto;
}
</style>
<title>TEST :: Sticker XMLParser</title>
	<script src="./js/importlibs.js"></script>
    <script type="text/javascript">
		window.onload = function()
		{
			onLoadXML();
		}
		
		// xml 로드
		function onLoadXML()
		{
			var _urlXMLFile;
			_urlXMLFile = document.getElementById( "path" ).value;
			
			var _loader;
			_loader = new STTextLoader();
			_loader.load( "GET", _urlXMLFile, true, { onComplete: onComplete } );
			
			function onComplete( text )
			{
				document.getElementById( "areaXML" ).value = text;
				onParseXML();
			}
		}
		// 박스 view
		function onParseXML()
		{
			var _container, _xml;
			_container = document.getElementById( "areaParse" );
			_container.innerHTML = "";
			
			_xml = STXMLParser.parse( document.getElementById( "areaXML" ).value );
			
			function makeBox( obj, parent )
			{
				var _div;
				_div = document.createElement( "div" );
				_div.className = "item";
				for( var k in obj )
				{
					var _h2;
					if( typeof obj[k] == "object" )
					{
						_h2 = document.createElement( "h1" );
						if( obj[k] instanceof Array ){
							_h2.innerHTML = k+" : array["+obj[k].length+"]";
						}else{
							_h2.innerHTML = k+" : object";
						}
						_div.appendChild( _h2 );
						makeBox( obj[k], _div );
					}else if( typeof obj[k] == "function" ){
						
						_h2 = document.createElement( "h1" );
						_h2.innerHTML = "function "+k+"() ->";
						_div.appendChild( _h2 );
					
						var _span = document.createElement( "span" );
						_span.innerHTML = obj[ k ]();
						_div.appendChild( _span );
						_div.appendChild( document.createElement( "br" ) );
					}else if( obj[k] != undefined ){
						
						_h2 = document.createElement( "h1" );
						_h2.innerHTML = k+" : ";
						_div.appendChild( _h2 );
					
						var _span = document.createElement( "span" );
						_span.innerHTML = obj[ k ];
						_div.appendChild( _span );
						_div.appendChild( document.createElement( "br" ) );
					}
				}
				parent.appendChild( _div );
				parent.appendChild( document.createElement( "br" ) );
			}
			
			makeBox( _xml, _container );
			
			//console.log( ""+_xml.campaign [0].image );
		}
		
		
	</script>
</head>

<body>
	<h1>Lv3. STXMLParser</h1>
    <h4>Code Sample</h4>
<pre class="examplefield"><span style="color:#ff5600">var</span> _xml <span style="color:#069;font-weight:700">=</span> STXMLParser.<span style="color:#45ae34;font-weight:700">parse</span>( <span style="color:#666">'xml text'</span> ); 
<span style="color:#ff5600">var</span> _att <span style="color:#069;font-weight:700">=</span> _xml[ <span style="color:#666">"@att"</span> ]; 
<span style="color:#ff5600">var</span> _list <span style="color:#069;font-weight:700">=</span> _xml.list; 
</pre>
    
<input width="400px" id="path" name="xml url" type="text" value="./text/sample.xml"/>
    <input type="button" value="load" onclick="onLoadXML();"/>
    <input type="button" value="parse" onclick="onParseXML();"/></br>
    <textarea  id="areaXML"></textarea>
    <div  id="areaParse"></div>
    <ul>
    <li class="desc">2013.03.21 - toString() 함수 정의를 통해 단일 노드 출력에 대한 간편화.<br /> (ex) console.log( ""+_xml.campaign [0].image );</li>
    <li class="desc">2013.02.21 - 최초 인자를 XML DOM 객체에서 response text 로 변경</li>
    <li class="desc">2013.02.18 - L3_XMLParser.js 작성시작</li>
    </ul>
</body>
</html>
